<%--
  Created by IntelliJ IDEA.
  User: 李元峰
  Date: 2022/10/20
  Time: 9:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set value="${pageContext.request.contextPath}" var="path"></c:set>
<!doctype html>
<html lang="en" class="pxp-root">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600;700&display=swap" rel="stylesheet">
    <link href="/static/web/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/web/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/web/css/owl.carousel.min.css">
    <link rel="stylesheet" href="/static/web/css/owl.theme.default.min.css">
    <link rel="stylesheet" href="/static/web/css/animate.css">
    <link rel="stylesheet" href="/static/web/css/style.css">

    <title>通知</title>
</head>
<body style="background-color: var(--pxpSecondaryColorLight);">
<jsp:include page="/web/personal/inc/personalCenterHead"></jsp:include>

    <div class="pxp-dashboard-content-details">
        <h1>通知</h1>
        <p class="pxp-text-light">您收到的所有通知的历史记录。</p>
        <div class="row justify-content-between align-content-center">
            <div class="col-auto order-2 order-sm-1">
                <div class="pxp-candidate-dashboard-jobs-bulk-actions mb-3">
                    <select class="form-select select_val" id="cao_zuo">
                        <option value="1">批量删除</option>
                        <option value="2">标记已读</option>
                    </select>
                    <button class="btn ms-2 cao_zuo">确认</button>
                </div>
            </div>
        </div>
        <div class="mt-4 mt-lg-5">
            <div class="table-responsive" id="noticeTable">
                <table class="table table-hover align-middle">

                </table>
            </div>
        </div>
    </div>

    <footer>
        <div class="pxp-footer-copyright pxp-text-light">© 2021 Jobster. All Right Reserved.</div>
    </footer>
</div>

<script src="/static/web/js/jquery-3.4.1.min.js"></script>
<script src="/static/web/js/bootstrap.bundle.min.js"></script>
<script src="/static/web/js/owl.carousel.min.js"></script>
<script src="/static/web/js/nav.js"></script>
<script src="/static/web/js/Chart.min.js"></script>
<script src="/static/web/js/main.js"></script>

<script>
    $(function (){
        changeTable(1);
        $("#noticeTable").on("click",".lastPage",function (){
           let pageNum = parseInt($(".active").find(".page-link").html());
           pageNum--;
           changeTable(pageNum);
           return false;
        });
        $("#noticeTable").on("click",".nextPage",function (){
            let pageNum = parseInt($(".active").find(".page-link").html());
            pageNum++;
            changeTable(pageNum);
            return false;
        });
        $("#noticeTable").on("click",".changePage",function (){
            let pageNum = parseInt($(this).html());
            changeTable(pageNum);
            return false;
        });
        $("#noticeTable").on("click",".deleteNotice",function (){
           if(confirm("您确定要删除这条通知吗？"))
           {
               let id = $(this).attr("id").slice(3);
               $.get("/web/personal/deleteNotice",{id:id},function (mes){
                   $(this).parent().parent().parent().parent().parent().remove();
               }.bind(this));
           }
        });

        $("#noticeTable").on("click",".reading",function (){
           let id = $(this).attr("id").slice(4);
           $.get("/web/personal/noticeIsReading",{id:id},function (mes){
               $(this).parent().parent().parent().parent().parent().find(".notReading").attr("class","fa fa-briefcase");
               $(this).parent().remove();
               let numOfNotice = parseInt($("#leftNotice").html());
               numOfNotice--;
               $("#leftNotice").html(numOfNotice);
               $("#numOfNotice").html(numOfNotice);
           }.bind(this));
        });

        $("#noticeTable").on("click","#checkAll",function (){
           $(".check_one").prop("checked",$("#checkAll").prop("checked"));
        });

        $(".cao_zuo").click(function (){
            if($(".check_one:checked").length==0)
            {
                alert("请至少勾选一个再进行操作");
                return;
            }
           let caoZuo = $("#cao_zuo").val();
           if (caoZuo==1)
           {
                let ids = new Array();
                $(".check_one:checked").each(function (){
                   ids.push($(this).data("id"));
                });
                $.ajax({
                    url: "/web/personal/batchDeleteNotice",
                    type:"get",
                    data: {
                      ids:ids
                    },
                    traditional: true,
                    success:function (){
                        location.href=location.href;
                    }
                });
           }
           if (caoZuo==2)
           {
               let ids = new Array();
               $(".check_one:checked").each(function (){
                   ids.push($(this).data("id"));
               });
               $.ajax({
                   url: "/web/personal/batchNoticeIsReading",
                   type:"get",
                   data: {
                       ids:ids
                   },
                   traditional: true,
                   success:function (){
                       location.href=location.href;
                   }
               });
           }
        });
    });

    function changeTable(pageNum)
    {
        $.ajax({
            url:"/web/personal/userNoticeTable",
            type:"post",
            data:{
                pageNum:pageNum
            },
            async:false,
            success:function (mes){
                $("#noticeTable").html(mes);
            }
        });
    }
</script>
</body>
</html>
